<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
  <meta name="keywords" content="">
  <meta name="description" content="">
  <link rel="stylesheet" href="css/base.css">
  <link rel="stylesheet" href="css/goodrate.css">
  <title>优惠券</title>
</head>

<body>
  <div class="container">
    <!-- 头部 -->
    <header>
      <div class="header">
        <a class="back" href="personal.html"></a>
        <span>我的优惠券</span>
      </div>
    </header>
    <!-- main -->
    <section>
      <div class="main">
        <div class="top">
          <div>未使用</div>
          <div>已使用/已过期</div>
        </div>
        <ul class="bottom">
          <li>
            <div class="left">
              <p class="price">￥100</p>
              <p class="desc">[满200元使用]</p>
            </div>
            <div class="right">
              <p class="title">
                <img src="images/goodrate/icon01.png" alt=""> <span>瓦萨一女装精品店</span>
              </p>
              <div class="right_bottom">
                <p class="time">19-08-01-19-08-30 </p>
                <button>立即使用</button>
              </div>
            </div>
          </li>
          <li>
            <div class="left">
              <p class="price">￥100</p>
              <p class="desc">[满200元使用]</p>
            </div>
            <div class="right">
              <p class="title">
                <img src="images/goodrate/icon01.png" alt=""> <span>瓦萨一女装精品店</span>
              </p>
              <div class="right_bottom">
                <p class="time">19-08-01-19-08-30 </p>
                <button>立即使用</button>
              </div>
            </div>
            <div class="use">
              已使用
            </div>
          </li>
          <li>
            <div class="left">
              <p class="price">￥100</p>
              <p class="desc">[满200元使用]</p>
            </div>
            <div class="right">
              <p class="title">
                <img src="images/goodrate/icon01.png" alt=""> <span>瓦萨一女装精品店</span>
              </p>
              <div class="right_bottom">
                <p class="time">19-08-01-19-08-30 </p>
                <button>立即使用</button>
              </div>
            </div>
            <div class="use">
              已使用
            </div>
          </li>
          <li>
            <div class="left">
              <p class="price">￥100</p>
              <p class="desc">[满200元使用]</p>
            </div>
            <div class="right">
              <p class="title">
                <img src="images/goodrate/icon01.png" alt=""> <span>瓦萨一女装精品店</span>
              </p>
              <div class="right_bottom">
                <p class="time">19-08-01-19-08-30 </p>
                <button>立即使用</button>
              </div>

            </div>
            <div class="use">
              已使用
            </div>
          </li>
          <li>
            <div class="left">
              <p class="price">￥100</p>
              <p class="desc">[满200元使用]</p>
            </div>
            <div class="right">
              <p class="title">
                <img src="images/goodrate/icon01.png" alt=""> <span>瓦萨一女装精品店</span>
              </p>
              <div class="right_bottom">
                <p class="time">19-08-01-19-08-30 </p>
                <button>立即使用</button>
              </div>
            </div>
            <div class="use">
              已使用
            </div>
          </li>
        </ul>
      </div>
    </section>
  </div>
</body>

</html>